<template>
    <div>
        姓：<input type="text" v-model="xing"> <br>
        名：<input type="text" v-model="ming"> <br>
        全称：{{xingming2}}  <br>
        全称：<input type="text" v-model="xingming2">
    </div>
</template>
<script>

import {ref,computed} from 'vue'

export default {
    name:'Test',
    setup() {
        let xing = ref('')
        let ming = ref('')

        //简写版
        let xingming = computed(()=>{
            return xing.value + '-' + ming.value
        })


        //完整写法
        let xingming2 = computed({
            get(){
                return xing.value + '-' + ming.value
            },
            set(value){
                let list = value.split('-')
                xing.value = list[0]
                ming.value = list[1]
                console.log(xing,ming)
            }
        })

        return{
            xing,
            ming,
            xingming2,
            
            
        }
    }
}
</script>
<style>
    
</style>